@function pxTorem($px){
  @return $px /75px * 1rem
}
.search{
  width:pxTorem(690px);
  height:pxTorem(100px);
  background: #FFFFFF;
  box-shadow: 0 pxTorem(10px) pxTorem(20px) 0 rgba(0,0,0,0.10);
  border-radius: pxTorem(10px);
  position: fixed;
  left:50%;
  margin-left:pxTorem(-345px);
  top:pxTorem(36px);
  z-index: 20;
  .search-con{
    width:100%;
    height:100%;
    display: flex;
    .search-icon{
      display: inline-block;
      width:pxTorem(28px);
      height:pxTorem(28px);
      margin:pxTorem(40px) pxTorem(26px) 0 pxTorem(27px);
    }
    .search-in{
      width:pxTorem(468px);
      height:100%;
      font-size: pxTorem(28px);
      color: #333333;
      letter-spacing: 0;
      line-height: pxTorem(28px);
    }
    .search-line{
      width:pxTorem(2px);
      height:pxTorem(40px);
      background: #f5f5f5;
      margin-top:pxTorem(30px);
    }
    .search-cancel{
      width:pxTorem(130px);
      height:100%;
      line-height:pxTorem(100px);
      text-align: center;
      font-size: pxTorem(28px);
      color: #B4B4B4;
    }
  }
  .search-cover{
    width:100%;
    height:100%;
    line-height:pxTorem(100px);
    text-align: center;
    position: absolute;
    left:0;
    top:0;
    z-index: 10;
    background: #fff;
    border-radius: pxTorem(10px);
    font-size: pxTorem(28px);
    color: #B4B4B4;
    letter-spacing: 0;
    .search-icon1{
      margin:0;
      vertical-align: middle;
    }
  }
}
.search-history{
  display: none;
  width:pxTorem(690px);
  height:auto;
  max-height:10rem;
  overflow-y: scroll;
  padding-bottom:pxTorem(40px);
  background: #F5F5F5;
  box-shadow: 0 pxTorem(10px) pxTorem(20px) 0 rgba(0,0,0,0.10);
  position: absolute;
  left:50%;
  top:pxTorem(120px);
  margin-left:pxTorem(-345px);
  z-index:19;
  .history-title{
    margin-top:pxTorem(16px);
    height:pxTorem(96px);
    border-bottom:pxTorem(3px) solid  #F0F0F0;
    line-height:pxTorem(96px);
    font-size: pxTorem(24px);
    color: #AAAAAA;
    letter-spacing: 0;
    text-indent: pxTorem(30px);
  }
  ul{
    width:100%;
    height:auto;
    li{
      height:pxTorem(96px);
      border-bottom:pxTorem(3px) solid  #F0F0F0;
      line-height:pxTorem(96px);
      font-size: pxTorem(26px);
      color: #333;
      letter-spacing: 0;
      text-indent: pxTorem(30px);
    }
  }
}
.search-list{
  display: none;
  width:pxTorem(690px);
  height:auto;
  max-height:8rem;
  padding-bottom:pxTorem(40px);
  background: #F5F5F5;
  box-shadow: 0 pxTorem(10px) pxTorem(20px) 0 rgba(0,0,0,0.10);
  position: absolute;
  left:50%;
  top:pxTorem(120px);
  margin-left:pxTorem(-345px);
  z-index:19;
  .list-title{
    margin-top:pxTorem(16px);
    height:pxTorem(96px);
    border-bottom:pxTorem(3px) solid  #F0F0F0;
    line-height:pxTorem(96px);
    font-size: pxTorem(24px);
    color: #AAAAAA;
    letter-spacing: 0;
    text-indent: pxTorem(30px);
  }
  ul{
    width:100%;
    height:auto;
    li{
      height:pxTorem(138px);
      border-bottom:pxTorem(3px) solid  #F0F0F0;
      font-size: pxTorem(26px);
      color: #333;
      text-indent: pxTorem(30px);
      h5{
        width:100%;
        font-size: pxTorem(26px);
        color: #333333;
        letter-spacing: 0;
        margin-top:pxTorem(30px);
        span{
          display: inline-block;
          width:pxTorem(20px);
          height:pxTorem(22px);
          background: #000;
        }
      }
      p{
        width:100%;
        font-size: pxTorem(22px);
        color: #AAAAAA;
        letter-spacing: 0;
        margin-top:pxTorem(15px);
      }
    }
  }
}
#rebackpark{
  width:100%;
  height:pxTorem(540px);
  //height:pxTorem(1046px);
  //border:1px solid green;
  position: fixed;
  left:0;
  bottom:0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  .rebackpark{
    width:100%;
    height:pxTorem(1046px);
    background: #FFFFFF;
    box-shadow: 0 pxTorem(-10px) pxTorem(20px) 0 rgba(0,0,0,0.05);
    .parkTop{
      width:100%;
      height:pxTorem(96px);
      border-bottom:pxTorem(2px) solid #f5f5f5;
      line-height:pxTorem(96px);
      font-size: pxTorem(24px);
      color: #AAAAAA;
      letter-spacing: 0;
      text-indent: pxTorem(30px);
    }
    .parklist{
      width:100%;
      height:pxTorem(1046px);
      overflow-y: hidden;
      margin-top:pxTorem(30px);
      ul{
        width:100%;
        padding-bottom:pxTorem(200px);
      }
      li{
        width:pxTorem(690px);
        height:pxTorem(188px);
        margin:0 auto pxTorem(10px);
        padding:pxTorem(20px);
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        background: #fcfcfc;
        -webkit-border-radius: pxTorem(10px);
        -moz-border-radius: pxTorem(10px);
        border-radius: pxTorem(10px);
        position: relative;
        .parkname{
          width:100%;
          height:pxTorem(37px);
          //display: flex;
          margin-top:pxTorem(10px);
          .circle{
            width:pxTorem(14px);
            height:pxTorem(14px);
            background: #09C16A;
            -webkit-border-radius: 100%;
            -moz-border-radius: 100%;
            border-radius: 100%;
            margin-top:pxTorem(12px);
            float: left;
          }
          .park{
            width:5.4rem;
            height:pxTorem(37px);
            margin-left:pxTorem(20px);
            font-size: pxTorem(26px);
            color: #333333;
            letter-spacing: 0;
            overflow-x: scroll;
            float: left;
          }
          .getcarpoint{
            font-size: pxTorem(10px);
            color: #FFFFFF;
            width:pxTorem(84px);
            height:pxTorem(30px);
            line-height:pxTorem(32px);
            margin-top:pxTorem(3px);
            background: #0DB95F;
            border-radius: pxTorem(16px);
            text-align: center;
            margin-left:pxTorem(12px);
            float: right;
            margin-right:1.4rem;
          }
          .distance{
            font-size: 8px;
            float: right;
            font-weight:100;
            color: #FFFFFF;
            width:pxTorem(100px);
            height:pxTorem(30px);
            line-height:pxTorem(34px);
            margin-top:pxTorem(3px);
            letter-spacing: -0.5;
            background: #D8D8D8;
            border-radius: pxTorem(16px);
            text-align: center;
            margin-right:1.1rem;
          }
        }
        .parkaddress{
          font-size: pxTorem(22px);
          color: #AAAAAA;
          letter-spacing: 0;
          width:87%;
          height:auto;
          margin-top:pxTorem(9px);
          overflow-x: scroll;
        }
        .fuwufei{
          font-size: pxTorem(22px);
          color: #FF8450;
          letter-spacing: 0;
          margin-top:pxTorem(9px);
          margin-right:20px;
        }
        .chose{
          width:pxTorem(40px);
          height:pxTorem(40px);
          -webkit-border-radius: 100%;
          -moz-border-radius: 100%;
          border-radius: 100%;
          position: absolute;
          top:pxTorem(68px);
          right:pxTorem(40px);
        }
      }
    }
  }
}
.rebackbg{
  width:pxTorem(750px);
  height:pxTorem(200px);
  position: fixed;
  bottom: 0;
  left:0;
  display: flex;
  background-image: linear-gradient(-180deg, rgba(255,255,255,0.00) 0%, #FFFFFF 41%);
  .reback {
    background: #DCDCDC;
    border-radius: pxTorem(50px);
    width:pxTorem(690px);
    height:pxTorem(100px);
    font-size: pxTorem(32px);
    color: #FFFFFF;
    line-height:pxTorem(100px);
    text-align: center;
    margin:pxTorem(70px) auto 0;
  }
  .choosecar{
    width:pxTorem(260px);
    height:pxTorem(100px);
    background: #F5F5F5;
    border-radius: pxTorem(50px);
    text-align: center;
    line-height:pxTorem(100px);
    font-size: pxTorem(32px);
    color: #999999;
    letter-spacing: 0;
    margin-left:pxTorem(30px);
    margin-top:pxTorem(70px);
    display: flex;
    span:last-child{
      height:100px;
      line-height:100px;
    }
  }
  .ordercar{
    margin-top:pxTorem(70px);
    width:pxTorem(400px);
    height:pxTorem(100px);
    background: #0DB95F;
    border-radius: pxTorem(50px);
    font-size: pxTorem(32px);
    color: #FFFFFF;
    letter-spacing: 0;
    line-height:pxTorem(100px);
    margin-left:pxTorem(30px);
    span:first-child{
      display: inline-block;
      height:100px;
      line-height:100px;
      margin-left:126px;
    }
  }
}
.tangram-suggestion-main{
  width:690px !important;
  top:135px !important;
  left:0 !important;
  margin-left:30px !important;
  //display: block !important;
}
#map1{
  width:100%;
  height:666px;
  .mappoint{
    position: absolute;
    z-index: 24;
    text-align: center;
    background: url("../../static/image/img_dot_bg.png");
    -webkit-background-size: cover;
    background-size: cover;
    color: #fff;
    font-weight:bold;
  }
  .mappoint[data-parkingid='userlocation']{
    background: #3EB2F9;
    border: 5px solid #FFFFFF ;/*no*/
    box-shadow: 0 4px 10px 0 rgba(36,112,156,0.20);/*no*/
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width:30px !important;/*no*/
    height:30px !important;/*no*/
    -webkit-animation: change 1s infinite;
    -o-animation: change 1s infinite;
    animation: change 1s infinite;
  }
  .mapspan{
    background: #000;
    position: absolute;
    left:-50%;
    top:-80%;
    color: #fff;
    text-align: center;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    display: none !important;
    z-index:9999;
  }
  .mappoint.active{
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    .mapspan{
      /*display: block;*/
    }
  }
}
.BMap_Marker{
  background: transparent !important;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width:30px /*no*/ ;
  height:30px /*no*/;
  left:-17px /*no*/;
  top:64px /*no*/;
  display: none;

}
@keyframes change {
  0%,100%{
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  50%{
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
